<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>沂水旅游-游圈</title>
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="/static/layuiadmin/layui/css/layui.css">
    <link rel="stylesheet" href="/static/index/css/base.css">
    <link rel="stylesheet" href="/static/index/css/youquanList.css">
</head>
<body>

{include file="public/header" model='circle' /}

<div class="searchBox">

    <div class="layui-container">
        <div class="mianbaoxie-nav">
            <span class="layui-breadcrumb">
              <a href="/">首页</a>
              <a><cite>友圈</cite></a>
            </span>
        </div>

        <div class="layui-row">
            <div class="layui-col-md9">
                <div class="layui-row">
                    <div class="layui-col-md2">
                        <a href="{:url('circle/circleList')}?kinds=0">
                            <div class="search-kind-box search-kind-box-0">
                                <div class="kinds-title ">旅游攻略</div>
                            </div>
                        </a>
                    </div>

                    {foreach $cat as $k => $v}
                    <div class="layui-col-md2">
                        <a href="{:url('circle/circleList')}?kinds={$v.id}">
                            <div class="search-kind-box search-kind-box-{$v.id}">
                                <div class="kinds-title">{$v.data_name}</div>
                            </div>
                        </a>
                    </div>
                    {/foreach}

                </div>
            </div>
        </div>
    </div>
</div>

<div class="youquan-list-box">

    <div class="layui-container">

        <div class="layui-row layui-col-space30">

            <div class="layui-col-md8">

                {notempty name='list'}
                <div class="layui-row layui-col-space20">

                    {foreach $list as $k => $v}
                    <div class="layui-col-md12">
                    <a href='{eq name="v.is_method" value="1"}{:url("Circle/method",["id"=>$v.id])}{else/}{:url("Circle/circle",["id"=>$v.id])}{/eq}'>
                        <div class="youquan-list-box-l">

                            <div class="layui-row">

                                {notempty name="v.image"}
                                <div class="layui-col-md3">
                                    <div class="youquan-cover-img">
                                            <img src="{$v.image}" alt="">
                                            {eq name="v.is_video" value="1"}
                                            <i class="layui-icon layui-icon-play" style="font-size: 30px; color:#20E6BA;"></i>
                                            {/eq}
                                    </div>
                                </div>
                                {/notempty}
                                <div
                                        {notempty name="v.image"}
                                        class="layui-col-md9"
                                        {else/}
                                        class="layui-col-md12"
                                        {/notempty}
                                >
                                    <div class="youquan-list-info" {empty name="v.image"}style="border-left:1px solid #DBDBDB;"{/empty} >

                                        <h1 class="youquan-list-title">
                                            {$v.title}
                                        </h1>
                                        <div class="youquan-list-content" style="height: 40px;">
                                            {$v.content}

                                        </div>
                                        <div class="youquan-list-user">

                                            <div class="layui-row">

                                                <div class="layui-col-md6">

                                                    <div class="youquan-list-user-l">

                                                        <div class="youquan-list-user-icon">

                                                            <img src="{$v.user_icon}" alt="">

                                                        </div>

                                                        <div class="youquan-list-user-name">
                                                            <span>{$v.nickname}</span>
                                                            <span>{$v.time}</span>
                                                        </div>

                                                    </div>

                                                </div>
                                                <div class="layui-col-md6">

                                                    <div class="youquan-list-num">

                                                        <span><i class="layui-icon layui-icon-praise"></i>{$v.like_num}</span>
                                                        <span><i class="layui-icon layui-icon-reply-fill"></i>{$v.read_num}</span>
                                                        <span><i class="layui-icon layui-icon-share"></i>{$v.share_num}</span>

                                                    </div>

                                                </div>

                                            </div>

                                        </div>

                                    </div>
                                </div>
                            </div>

                        </div>
                    </a>

                    </div>
                    {/foreach}

                </div>
                {else/}
                <div class="layui-row">
                    <div style="width: 100%;height: 300px;text-align: center;line-height: 300px;color: #5c5c5c;background: #fcfcfc">
                        暂无数据
                    </div>
                </div>
                {/notempty}

                <div class="pageOption" style="padding: 20px  0">
                    {$data->render()}
                </div>

            </div>

            <div class="layui-col-md4">

                <div class="youquan-list-r">

                    <div class="youquan-list-write-gonglve">
                        <a href="javascript:;" id="toWriteMethod">
                            <i class="layui-icon layui-icon-edit" style="font-size: 20px; color:#ffffff;"></i>
                            写攻略
                        </a>
                    </div>
                    <div class="youquan-list-write-youquan">

                        <a href="javascript:;" id="toWriteCircle" class="youquan-list-write-youquan-tuwen">
                            <i class="layui-icon layui-icon-picture" style="font-size: 20px; color: #ffffff;"></i>友圈（图文）
                        </a>

                        <a href="javascript:;" id="toWriteVideoCircle" class="youquan-list-write-youquan-shipin">
                            <i class="layui-icon layui-icon-video" style="font-size: 20px; color: #ffffff;"></i>友圈（视频）
                        </a>

                    </div>

                    <div class="youquan-list-hot">

                        <div class="youquan-list-hot-top">

                            <img src="/static/index/images/hot.png" alt="">
                            热门攻略

                        </div>
                        <div class="youquan-list-hot-list">

                            {notempty name="wellMethod"}
                            <ul>
                                {foreach $wellMethod as $k2 => $v2}
                                <li>
                                    <div class="youquan-list-hot-list-img">
                                        <a href="{:url('Circle/method',['id'=>$v2.id])}">
                                        <img src="{$v2.image}" alt="">
                                        </a>
                                    </div>
                                    <div class="youquan-list-hot-list-info">
                                        <div class="youquan-list-hot-list-title">
                                            <a href="{:url('Circle/method',['id'=>$v2.id])}">{$v2.title}</a>
                                        </div>
                                        <div class="youquan-list-hot-list-user">
                                            <span>{$v2.nickname}</span>
                                            <span>{$v2.time}</span>
                                        </div>
                                    </div>
                                </li>
                                {/foreach}
                            </ul>
                            {else/}
                            <div style="width: 100%;height: 300px;line-height: 300px;text-align: center;color: #5c5c5c;">
                                暂无数据
                            </div>
                            {/notempty}


                        </div>

                    </div>

                </div>

            </div>

        </div>

    </div>

</div>


<div style="height: 100px;"></div>

{include file="public/footer" /}

<script>
        var element = layui.element;
        var form    = layui.form;

        form.render();
        element.init();

    function getQueryVariable(variable) {
        var query = window.location.search.substring(1);
        var vars = query.split("&");
        for (var i = 0; i < vars.length; i++) {
            var pair = vars[i].split("=");
            if (pair[0] == variable) {
                return pair[1];
            }
        }
        return (false);
    }

    var kinds = getQueryVariable('kinds');

    if (kinds) {
        var className = '.search-kind-box-' + kinds;

        $(className).addClass('search-kind-box-active');

    } else {

        $('.search-kind-box-0').addClass('search-kind-box-active');

    }

    var uid = '{$Think.session.uid}';
    $('#toWriteMethod').click(function(){

        if (!uid) {
            layer.msg('请先登录', {time: 1000});
            return false;
        }

        window.location.href="{:url('circle/writeMethod')}";

    });

    $('#toWriteCircle').click(function(){
        if (!uid) {
            layer.msg('请先登录', {time: 1000});
            return false;
        }

        window.location.href="{:url('circle/writeCircle')}";
    });



    $('#toWriteVideoCircle').click(function(){
        if (!uid) {
            layer.msg('请先登录', {time: 1000});
            return false;
        }

        window.location.href="{:url('circle/writeVideoCircle')}";
    });
</script>
</body>
</html>